import React from 'react';
import ReactDOM from 'react-dom';
import { Router, Link,browserHistory } from 'react-router';

export default function Alert({self}){
    var {alertDisplay,alertText,alertFn} = self.state;

    return (
        <div className="modal" style={{display:alertDisplay}}>
          <div className="modal-dialog">
            <div className="modal-content">
              <div className="modal-header">
                <button type="button" className="close"  onClick={()=>Alert.close(self)}>
                  <span aria-hidden="true">&times;</span></button>
                <h4 className="modal-title">提示</h4>
              </div>
              <div className="modal-body">
                {alertText}
              </div>
              <div className="modal-footer">
                <button type="button" className="btn btn-default pull-left" onClick={()=>Alert.close(self)}>关闭</button>
                {alertFn?
                     <button 
                        type="button" 
                        className="btn btn-primary"
                        onClick = {()=>{
                            alertFn();
                            Alert.close(self)
                        }}
                    >确认</button>
                     :
                    <button 
                        type="button" 
                        className="btn btn-primary" 
                        onClick={()=>Alert.close(self)}
                    >确认</button>
                }
               
              </div>
            </div>
          </div>
        </div>
    )
}


Alert.alert = function(self,msg){
    self.setState({
        alertDisplay:'block',
        alertText:msg
    })

}

Alert.confirm = function(self,msg,fn){
    self.setState({
        alertDisplay:'block',
        alertText:msg,
        alertFn:fn
    })
}

Alert.close = function(self){
    self.setState({
        alertDisplay:'none',
        alertText:'',
        alertFn:null
    })
}